<style type="text/css">

    .livestreaming {
        margin-bottom: 2.2em;
    }

    .kegiatan-bulan {
        margin-bottom: 0.4em;
    }

    .livestreaming .screen {
        width: 480px;
        height: 295px;
        border: 1px solid black;
        display: block;
        margin: 1em auto;
        background-color: black;
    }

    .video-gallery .list {
        display: block;
        width: 650px;
        height: 400px;
        border: 1px solid black;
    }
</style>
<div class="livestreaming">
    <div class="title">Live Report</div>
    <div class="screen">

    </div>
</div>
<script type="text/javascript">
    jQuery(document).ready(function() {
        var liveStreams = "<iframe width=\"480\" height=\"295\" src=\"http://cdn.livestream.com/embed/perdesaansehat?layout=4&color=0x00b319&autoPlay=true&mute=false&iconColorOver=0xffffff&iconColor=0xe4f9e6&allowchat=true&height=295&width=480\" style=\"border:0;outline:0;\" frameborder=\"0\" scrolling=\"no\"></iframe>";
        if (is_mobile) {
            liveStreams = "<a href=\"http://xperdesaansehatx.api.channel.livestream.com/3.0/playlist.m3u8\"><img style=\"width: 480px; height: 295px;\" src=\"http://thumbnail.api.livestream.com/thumbnail?name=chan\" /></a>";
            setInterval("updateThumb()", 10000);
            updateThumb();
        }
        $(".livestreaming .screen").html(liveStreams);
    });
    function updateThumb() {
        $(".livestreaming .screen a img").prop("src", "http://thumbnail.api.livestream.com/thumbnail?name=chan&t="
                + new Date().valueOf());
    }

</script>